<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<title>设置时间</title>

		<link rel="stylesheet" href="../css/framework7.material.min.css">	

		<script src="../js/jquery.1.7.2.min.js" type="text/javascript"></script>

<script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script>
		<link rel="stylesheet" type="text/css" href="../css/jquery.datetimepicker.css" />
		<script src="../js/jquery.datetimepicker.full.min.js"></script>
	</head>
	<body class="" style="height: 900px;" onload="a()">

		<!-- Views -->

		<div class="navbar">
			<div class="navbar-inner">
				<div class="center sliding">设置时间</div>
				<div class="right">
					<a href="#" class="link icon-only open-panel"><i class="icon icon-bars-blue"></i></a>
				</div>
			</div>
		</div>
		
		<span class="floating-button addbtn" style="top: 8%;left: 48%;"><i class="icon icon-plus"></i></span>
		<span class="floating-button " style="top: 8%;left: 20%;" id="bb"><img src="../images/empty.png" width="16px" height="16px" /></span>
		<span class="floating-button " style="top: 8%;right: 20%;" id="bbb"><img src="../images/jian.png" width="16px" height="16px" /></span>
		<span class="floating-button " style="top: 8%;right: 2%;" id="bbb3"><img src="../images/shuanxin.png" width="16px" height="16px" /></span>

		<div class="pages navbar-through toolbar-through" style="top: 11%;height: 80%;">
			<div data-page="index" class="page">

				<!--内容开始-->
				<script>
				data=""
					$.post("http://localhost:86/HBuilder/xops/Back.php", {
						type: "Uptime",
						operation: "search",
					
						token: "1ab66e59325257b60b971d4afa1505ce"
					}, function(data, status) {
					// alert("data:" + (data));
						obj = JSON.parse(data)
						data=obj.data;
					op(data)
					})
					
					function op(data){
						// alert("fdg:"+data)
					for(var i in data){
						
						// console.log(":"+i+" "+data[i]+" "+typeof(data[i]))
			ki = $('ul').children('li').length + 1;
			$("ul").append(
				'<li class="swipeout" >' +
				'<div class="item-content">' +
				'<div class="item-inner">' +
				'<span name="" id="" style="margin-left:30%;">' + '第' + (ki) + '节' +
				'</span>' +
				'<span style="color: red;"><input class="datetimepicker" id="' + ki +
				'begin" style="border-width: 0;color:blue;font-size: 18px;"  value="'+data[i]["begin"]+'"  /><input class="datetimepicker" id="' +
				ki +
				'over" style="margin-right: 2;border-width: 0;color:blue;font-size: 18px;"  value="'+data[i]["begin"]+'"/><img src="../images/right2.png"  /></span> ' +
			
				'</div>' +
			
				'</div>' +
				'</li>'
			
			);
			// break;
			// }
				
					}
					}
					
				</script>

				<div class="page-content">

					<div class="list-block">

						<ul id="it">
						
						</ul>

						<div class="col-100 ">
							<button class="button button-fill color-red" style="width: 100%" id="save">保存</button>
						</div>


					</div>
     
	
				</div>
				<!--内容结束-->
				
			</div>
		</div>
		
		<script>
			$(function(){
			
				$('.datetimepicker').datetimepicker({
					datepicker: false,
					format: 'H:i',
					startDate: date,		
					step: 5
				});
			})
			layui.use(['laypage', 'layer'], function() {
							var laypage = layui.laypage,
								layer = layui.layer;
			
						

			});
			date = new Date()
			date.setHours("06");
			date.setMinutes("00");
			$("#bbb3").click(function(){
				window.location.href="javascript:location.replace(location.href)";
				
			})
			function a() {
				

				$('.datetimepicker').datetimepicker({
					datepicker: false,
					format: 'H:i',
					startDate: date,		
					step: 5
				});
				
			
				
			}
			
			$("#bb").click(function() {

				layer.confirm('您确定要全部删除数据吗？', {icon: 5, title:'提示'}, function(index,layero){
  //do something
  	$('ul').children().filter("li").remove()
	layer.msg("删除成功！",{icon:6,"title":"提示"})
  layer.close(index);
});
			;
			})

			$("#bbb").click(function() {
				$('ul li:last-child').remove()
				// $('ul li:last').remove()
			})
			$("#save").click(function() {
				var ullen = $('ul').children('li').length;
				// alert("p:" + $('ul').children('li').length);
				arr_sk = [];
				arr_xk = [];
				for (var k = 1; k <= ullen; k++) {
					var sk = $("#" + k + "begin").val();
					var xk = $("#" + k + "over").val();
					arr_sk.push(sk);
					arr_xk.push(xk);

				}
				// alert("qm:"+arr_sk.length+" = "+arr_xk.join(","))
				  $.post("http://localhost:86/HBuilder/xops/Back.php",{
					     
					     type:"Time",
			
					     begin:arr_sk.join(","),
						 over:arr_xk.join(","),
						 token:"1ab66e59325257b60b971d4afa1505ce"
					     
					   },function(data,status){
				// alert(data)
				   obj=JSON.parse(data);
				   if(obj.code==200){
					  
					       layer.msg('保存成功!',{icon:1,time:1500});
					 
					 
				   }else if(obj.code==202){
					   layer.msg('保存失败!',{icon:1,time:1500})
				   }
				
				})
			})

			$(".addbtn").click(function() {
				ki = $('ul').children('li').length + 1;
				$("ul").append(
					'<li class="swipeout" >' +
					'<div class="item-content">' +
					'<div class="item-inner">' +
					'<span name="" id="" style="margin-left:30%;">' + '第' + (ki) + '节' +
					'</span>' +
					'<span style="color: red;"><input class="datetimepicker" id="' + ki +
					'begin" style="border-width: 0;color:blue;font-size: 18px;"  value="上课时间"  /><input class="datetimepicker" id="' +
					ki +
					'over" style="margin-right: 2;border-width: 0;color:blue;font-size: 18px;"  value="下课时间"/><img src="../images/right2.png"  /></span> ' +

					'</div>' +

					'</div>' +
					'</li>'

				);
	
				$('.datetimepicker').datetimepicker({
					datepicker: false,
					format: 'H:i',
					startDate: date,
					step: 5
				});
				
				

				$('.item-input').each(function(i) {
					console.log($(this).find('img:first').attr('id', 'zoom' + i));
					console.log($(this).find('img:first').next().attr('id', 'add' + i));
				})

			});
		</script>

	</body>
</html>
